<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>欢迎</title>
    <link rel="stylesheet" href="css/bootstrap.min.css">
</head>
<body>
<p>直接调用</p>
<button type="button"  class="btn layui-btn layui-btn-normal">8001</button>
<button type="button"  class="btn layui-btn layui-btn-normal">8002</button>
<button type="button"  class="btn layui-btn layui-btn-normal">8003</button>
<input type="button" id="btnPost"  class="layui-btn layui-btn-normal" value="post"></input>
<div>
    <p>通过网关调用</p>
    <button type="button"  class="rest layui-btn layui-btn-normal">8001</button>
    <button type="button"  class="rest layui-btn layui-btn-normal">8002</button>
    <button type="button"  class="rest layui-btn layui-btn-normal">8003</button>
    <input type="button" id="restPost"  class="layui-btn layui-btn-normal" value="post测试"></input>
    <input type="button" id="post8001"  class="layui-btn layui-btn-normal" value="post传参测试"></input>
    <input type="button" id="addPost"  class="layui-btn layui-btn-normal" value="post传参测试(@RequestBody)"></input>
</div>
<div id="result"></div>
<p>===========================</p>
<div id="note">
    <ol style="font-weight: bold;">
        <li>访问本页面会自动跳转到uaa，登录成功后跳回本页面</li>
        <li>8000端口为网关服务器端口，前端页面可以放在本项目，或单独开发</li>
        <li>8001-8003端口都是后端api服务器端口，实现了单点登录</li>
        <li>9999端口是UAA(User Account and Authentication)服务器端口，管理用户登录</li>
        <li>前端项目应该通过8000端口服务器（网关）调用8001-8003的api，不要直接调用8001-8003的api</li>
    </ol>

</div>
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script>
    $(function () {
        if(document.referrer == '') {
            location.href = 'http://localhost:9999/uaa'
            return
        }
        $.ajaxSetup({
            xhrFields: {
                withCredentials: true
            }
        });
        // 主动请求服务器一次，自动单点登录，以便后续api调用
        $.getJSON("serverUrls", function (res) {
            $.each(res, function (i, url) {
                $.get(url)
            })
        })

        $("button.btn").click(function () {
            let port =  ":" + $(this).text();
            console.log(port);
            $.ajax({
                dataType: 'json',
                url: 'http://localhost' + port  + "/hello",
                success: function (result, status, xhr) {
                    $("#result").html(JSON.stringify(result));
                },
                error: function(x) {
                    console.log(x);
                    $("#result").html('出错了')
                    //handleSocialLogin()
                }
            })
        });

        $("#btnPost").click(function () {
            $.ajax({
                dataType: 'json',
                type: 'post',
                url: 'http://localhost:8001/me',
                success: function (result, status, xhr) {
                    $("#result").html(JSON.stringify(result));
                },
                error: function(x) {
                    console.log(x);
                    $("#result").html('出错了')
                }
            })
        })

        $("button.rest").click(function () {
            let port =  $(this).text();
            $.ajax({
                dataType: 'json',
                url: '/hello?port=' + port,
                success: function (result, status, xhr) {
                    $("#result").html(JSON.stringify(result));
                },
                error: function(x) {
                    console.log(x);
                    $("#result").html('出错了')
                    //handleSocialLogin()
                }
            })
        });

        $("#restPost").click(function () {
            $.ajax({
                dataType: 'json',
                type: 'post',
                url: '/8001me',
                success: function (result, status, xhr) {
                    $("#result").html(JSON.stringify(result));
                },
                error: function(x) {
                    console.log(x);
                    $("#result").html('出错了')
                }
            })
        })
        $("#post8001").click(function () {
            $.ajax({
                dataType: 'json',
                type: 'post',
                url: '/8001Post',
                success: function (result, status, xhr) {
                    $("#result").html(JSON.stringify(result));
                },
                error: function(x) {
                    console.log(x);
                    $("#result").html('出错了')
                }
            })
        })
        $("#addPost").click(function () {
            $.ajax({
                dataType: 'json',
                type: 'post',
                url: '/8001Add',
                success: function (result, status, xhr) {
                    $("#result").html(JSON.stringify(result));
                },
                error: function(x) {
                    console.log(x);
                    $("#result").html('出错了')
                }
            })
        })
    })
</script>
</body>
</html>